@import './theme.less';
// Tag
.ant-tag{
    // border-radius: @TAG-ALL-BorderRadius!important;
    padding:@TAG-ALL-Padding!important;
  }
  // tag风格
  ._tag_color{
    color: #fff !important;
    background-color: @TAG-Default-color !important;
    // status
    &.status{
      &.open{
        &.default{
          color: #fff!important;
          background-color: @TAGSt-OPEN-Color!important;
        }
        &.Online{
          color: @TAGSt-OPEN-Color!important;
          background-color: transparent!important;
          border: 1px @TAGSt-OPEN-Color solid!important;
        }
        &.Dot{
          color: #000!important;
          border: none!important;;
          background: transparent!important;
        }
        &.Dot::before{
          content: "●";
          color: @TAGSt-OPEN-Color!important;
          margin-right: 5px;
          margin-left: -15px;
        }
      }
  
      &.close{
        &.default{
          color: #fff!important;
          background-color: @TAGSt-CLOSE-Color!important;
        }
        &.Online{
          color: @TAGSt-CLOSE-Color!important;
          background-color: transparent!important;
          border: 1px @TAGSt-CLOSE-Color solid!important;
        }
        &.Dot{
          color: #000!important;
          border: none!important;;
          background: transparent!important;
        }
        &.Dot::before{
          content: "●";
          color: @TAGSt-CLOSE-Color!important;
          margin-right: 5px;
          margin-left: -15px;
        }
      }
  
      &.processing{
        &.default{
          color: #fff!important;
          background-color: @TAGSt-PRO-Color!important;
        }
        &.Online{
          color: @TAGSt-PRO-Color!important;
          background-color: transparent!important;
          border: 1px @TAGSt-PRO-Color solid!important;
        }
        &.Dot{
          color: #000!important;
          border: none!important;;
          background: transparent!important;
        }
        &.Dot::before{
          content: "●";
          color: @TAGSt-PRO-Color!important;
          margin-right: 5px;
          margin-left: -15px;
        }
      }
  
    }
    // priority
    &.priority{
      &.P1{
        &.default{
          color: #fff!important;
          background-color: @TAGPri-P1-Color!important;
        }
        &.Online{
          color: @TAGPri-P1-Color!important;
          background-color: transparent!important;
          border: 1px @TAGPri-P1-Color solid!important;
        }
        &.Dot{
          color: #000!important;
          border: none!important;;
          background: transparent!important;
        }
        &.Dot::before{
          content: "●";
          color: @TAGPri-P1-Color!important;
          margin-right: 5px;
          margin-left: -15px;
        }
      }
      &.P2{
        &.default{
          color: #fff!important;
          background-color: @TAGPri-P2-Color!important;
        }
        &.Online{
          color: @TAGPri-P2-Color!important;
          background-color: transparent!important;
          border: 1px @TAGPri-P2-Color solid!important;
        }
        &.Dot{
          color: #000!important;
          border: none!important;;
          background: transparent!important;
        }
        &.Dot::before{
          content: "●";
          color: @TAGPri-P2-Color!important;
          margin-right: 5px;
          margin-left: -15px;
        }
      }
      &.P3{
        &.default{
          color: #fff!important;
          background-color: @TAGPri-P3-Color!important;
        }
        &.Online{
          color: @TAGPri-P3-Color!important;
          background-color: transparent!important;
          border: 1px @TAGPri-P3-Color solid!important;
        }
        &.Dot{
          color: #000!important;
          border: none!important;;
          background: transparent!important;
        }
        &.Dot::before{
          content: "●";
          color: @TAGPri-P3-Color!important;
          margin-right: 5px;
          margin-left: -15px;
        }
      }
      &.P4{
        &.default{
          color: #fff!important;
          background-color: @TAGPri-P4-Color!important;
        }
        &.Online{
          color: @TAGPri-P4-Color!important;
          background-color: transparent!important;
          border: 1px @TAGPri-P4-Color solid!important;
        }
        &.Dot{
          color: #000!important;
          border: none!important;;
          background: transparent!important;
        }
        &.Dot::before{
          content: "●";
          color: @TAGPri-P4-Color!important;
          margin-right: 5px;
          margin-left: -15px;
        }
      }
      &.P5{
        &.default{
          color: #fff!important;
          background-color: @TAGPri-P5-Color!important;
        }
        &.Online{
          color: @TAGPri-P5-Color!important;
          background-color: transparent!important;
          border: 1px @TAGPri-P5-Color solid!important;
        }
        &.Dot{
          color: #000!important;
          border: none!important;;
          background: transparent!important;
        }
        &.Dot::before{
          content: "●";
          color: @TAGPri-P5-Color!important;
          margin-right: 5px;
          margin-left: -15px;
        }
      }
    }
    // security
    &.security{
      &.warning{
        &.default{
          color: #fff!important;
          background-color: @TAGSec-WARNING-Color!important;
        }
        &.Online{
          color: @TAGSec-WARNING-Color!important;
          background-color: transparent!important;
          border: 1px @TAGSec-WARNING-Color solid!important;
        }
        &.Dot{
          color: #000!important;
          border: none!important;;
          background: transparent!important;
        }
        &.Dot::before{
          content: "●";
          color: @TAGSec-WARNING-Color!important;
          margin-right: 5px;
          margin-left: -15px;
        }
      }
      &.danger{
        &.default{
          color: #fff!important;
          background-color: @TAGSec-DANGER-Color!important;
        }
        &.Online{
          color: @TAGSec-DANGER-Color!important;
          background-color: transparent!important;
          border: 1px @TAGSec-DANGER-Color solid!important;
        }
        &.Dot{
          color: #000!important;
          border: none!important;;
          background: transparent!important;
        }
        &.Dot::before{
          content: "●";
          color: @TAGSec-DANGER-Color!important;
          margin-right: 5px;
          margin-left: -15px;
        }
      }
      &.error{
        &.default{
          color: #fff!important;
          background-color: @TAGSec-ERROR-Color!important;
        }
        &.Online{
          color: @TAGSec-ERROR-Color!important;
          background-color: transparent!important;
          border: 1px @TAGSec-ERROR-Color solid!important;
        }
        &.Dot{
          color: #000!important;
          border: none!important;;
          background: transparent!important;
        }
        &.Dot::before{
          content: "●";
          color: @TAGSec-ERROR-Color!important;
          margin-right: 5px;
          margin-left: -15px;
        }
      }
      &.safe{
        &.default{
          color: #fff!important;
          background-color: @TAGSec-SAFE-Color!important;
        }
        &.Online{
          color: @TAGSec-SAFE-Color!important;
          background-color: transparent!important;
          border: 1px @TAGSec-SAFE-Color solid!important;
        }
        &.Dot{
          color: #000!important;
          border: none!important;;
          background: transparent!important;
        }
        &.Dot::before{
          content: "●";
          color: @TAGSec-SAFE-Color!important;
          margin-right: 5px;
          margin-left: -15px;
        }
      }
    }
    // option
    &.option{
      &.blue{
        &.default{
          color: #fff!important;
          background-color: @TAGOp-BLUE-Color!important;
        }
        &.Online{
          color: @TAGOp-BLUE-Color!important;
          background-color: transparent!important;
          border: 1px @TAGOp-BLUE-Color solid!important;
        }
        &.Dot{
          color: #000!important;
          border: none!important;;
          background: transparent!important;
        }
        &.Dot::before{
          content: "●";
          color: @TAGOp-BLUE-Color!important;
          margin-right: 5px;
          margin-left: -15px;
        }
      }
      &.cyan{
        &.default{
          color: #fff!important;
          background-color: @TAGOp-CYAN-Color!important;
        }
        &.Online{
          color: @TAGOp-CYAN-Color!important;
          background-color: transparent!important;
          border: 1px @TAGOp-CYAN-Color solid!important;
        }
        &.Dot{
          color: #000!important;
          border: none!important;;
          background: transparent!important;
        }
        &.Dot::before{
          content: "●";
          color: @TAGOp-CYAN-Color!important;
          margin-right: 5px;
          margin-left: -15px;
        }
      }
      &.purple{
        &.default{
          color: #fff!important;
          background-color: @TAGOp-PURPLE-Color!important;
        }
        &.Online{
          color: @TAGOp-PURPLE-Color!important;
          background-color: transparent!important;
          border: 1px @TAGOp-PURPLE-Color solid!important;
        }
        &.Dot{
          color: #000!important;
          border: none!important;;
          background: transparent!important;
        }
        &.Dot::before{
          content: "●";
          color: @TAGOp-PURPLE-Color!important;
          margin-right: 5px;
          margin-left: -15px;
        }
      }
      &.purple_dark{
        &.default{
          color: #fff!important;
          background-color: @TAGOp-PURPLE-Dark-Color!important;
        }
        &.Online{
          color: @TAGOp-PURPLE-Dark-Color!important;
          background-color: transparent!important;
          border: 1px @TAGOp-PURPLE-Dark-Color solid!important;
        }
        &.Dot{
          color: #000!important;
          border: none!important;;
          background: transparent!important;
        }
        &.Dot::before{
          content: "●";
          color: @TAGOp-PURPLE-Dark-Color!important;
          margin-right: 5px;
          margin-left: -15px;
        }
      }
      &.orange{
        &.default{
          color: #fff!important;
          background-color: @TAGOp-ORANGE-Color!important;
        }
        &.Online{
          color: @TAGOp-ORANGE-Color!important;
          background-color: transparent!important;
          border: 1px @TAGOp-ORANGE-Color solid!important;
        }
        &.Dot{
          color: #000!important;
          border: none!important;;
          background: transparent!important;
        }
        &.Dot::before{
          content: "●";
          color: @TAGOp-ORANGE-Color!important;
          margin-right: 5px;
          margin-left: -15px;
        }
      }
      &.red{
        &.default{
          color: #fff!important;
          background-color: @TAGOp-RED-Color!important;
        }
        &.Online{
          color: @TAGOp-RED-Color!important;
          background-color: transparent!important;
          border: 1px @TAGOp-RED-Color solid!important;
        }
        &.Dot{
          color: #000!important;
          border: none!important;;
          background: transparent!important;
        }
        &.Dot::before{
          content: "●";
          color: @TAGOp-RED-Color!important;
          margin-right: 5px;
          margin-left: -15px;
        }
      }
      &.gray{
        &.default{
          color: #fff!important;
          background-color: @TAGOp-GRAY-Color!important;
        }
        &.Online{
          color: @TAGOp-GRAY-Color!important;
          background-color: transparent!important;
          border: 1px @TAGOp-GRAY-Color solid!important;
        }
        &.Dot{
          color: #000!important;
          border: none!important;;
          background: transparent!important;
        }
        &.Dot::before{
          content: "●";
          color: @TAGOp-GRAY-Color!important;
          margin-right: 5px;
          margin-left: -15px;
        }
      }
    }
  }

  ._Default_Search{
    max-width: 800px!important;
  }

  ._Search_{
    &.default{
      border-radius: 5px 0 0 5px;
      // width: 340px;
      // left: 10px;
      position: relative;
      left: 0;
      margin-left: 2vw;
      // flex: none;
      float: left;
    }
    &.default{
      &.button{
        background-color: #188EFB!important;
        color:#fff;
        line-height: 30px;
        height: 32px;
        width: 50px;
        margin-left: -6px;
        border-radius: 0px 5px 5px 0px;
      }
    }
  }
  .ant-image-preview-mask{
    background-color: #000!important;
    opacity: .9;
  }